<!DOCTYPE html>
<html lang="zh-CN">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no">
    <title>翻译助手</title>
    <!-- Bootstrap CSS -->
    <link href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.0/dist/css/bootstrap.min.css" rel="stylesheet">
    <!-- 自定义CSS -->
    <link href="css/style.css" rel="stylesheet">
    <!-- Font Awesome -->
    <link href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.0.0/css/all.min.css" rel="stylesheet">
</head>
<body class="mobile-container">
    <!-- 主要内容区域 -->
    <div class="content-area">
        <div id="pageContent"></div>
    </div>

    <!-- 底部导航栏 -->
    <nav class="mobile-nav fixed-bottom">
        <div class="nav-item">
            <a href="#home" class="nav-link active">
                <i class="fas fa-language"></i>
                <span>翻译</span>
            </a>
        </div>
        <div class="nav-item">
            <a href="#voice" class="nav-link">
                <i class="fas fa-microphone"></i>
                <span>语音</span>
            </a>
        </div>
        <div class="nav-item">
            <a href="#video" class="nav-link">
                <i class="fas fa-video"></i>
                <span>视频</span>
            </a>
        </div>
        <div class="nav-item">
            <a href="#settings" class="nav-link">
                <i class="fas fa-cog"></i>
                <span>设置</span>
            </a>
        </div>
    </nav>

    <!-- Bootstrap Bundle with Popper -->
    <script src="https://cdn.jsdelivr.net/npm/bootstrap@5.3.0/dist/js/bootstrap.bundle.min.js"></script>
    <!-- 自定义JS -->
    <script src="js/main.js"></script>
    
    <script>
    // 检查登录状态
    function checkLogin() {
        const token = localStorage.getItem('access_token');
        if (!token) {
            window.location.href = 'pages/login.html';
        }
    }

    // 退出登录
    function logout() {
        localStorage.removeItem('access_token');
        localStorage.removeItem('token_type');
        localStorage.removeItem('user_info');
        localStorage.removeItem('username');
        localStorage.removeItem('remember_me');
        window.location.href = 'pages/login.html';
    }

    // 页面加载时检查登录状态
    document.addEventListener('DOMContentLoaded', () => {
        checkLogin();

        // 监听设置页面的加载
        window.addEventListener('hashchange', () => {
            if (window.location.hash === '#settings') {
                const pageContent = document.getElementById('pageContent');
                // 在设置页面添加退出登录按钮
                pageContent.innerHTML = `
                    <div class="container mt-4">
                        <h2>设置</h2>
                        <div class="list-group mt-3">
                            <button class="list-group-item list-group-item-action" onclick="logout()">
                                <i class="fas fa-sign-out-alt text-danger"></i> 退出登录
                            </button>
                        </div>
                    </div>
                `;
            }
        });
    });
    </script>
</body>
</html> 